//点击导航条变色
$(function () {
	// 隐藏除我的避风港的其他模块
	$('.list-me-mymessage,.myorder,.mymessage,.mycomment,.mysafe,.time').hide();
	// 为左侧菜单栏添加样式
	$('.list ul li').hover(function () {
		$(this).css('cursor', 'pointer');
	}).click(function () {
		$('.list ul li').removeClass('list-click-css');
		$(this).addClass('list-click-css');
	});
	// 个人信息菜单显示隐藏切换
	$('.my').click(function () {
		$('.list-me-mymessage').toggle()
	})
	// 从其他模块点击回来时显示
	$('.list-me').click(function () {
		$('.myhaven').show();
		$('.list-me-mymessage,.myorder,.mymessage,.mycomment,.mysafe,.time').hide();
	})
	$('.list-order').click(function () {
		$('.list-me-mymessage,.myhaven,.mymessage,.mycomment,.mysafe,.time').hide();
		$('.myorder').show();
	})
	//订单导航条样式
	$('.order-top ul li').click(function () {
		$('.order-top ul li').removeClass('nav-click-css');
		$(this).addClass('nav-click-css');
	})

	$('.nav-item').click(function () {
		$(this).children().addClass('active');
		$(this).siblings('li').children().removeClass('active')
	})

	// 我的避风港数据渲染
	$.ajax({
		url: "http://localhost:8080/user/showAllInfo",
		type: "GET",
		headers: {
			"token": sessionStorage.getItem('token')
		},
		success: function (rs) {
			data = rs.t;
			$('.user-item h4').html('尊敬的' + data.userNickname)
		},
		error: function (xhr, status, error) {
			// alert("信息请求失败！");
			console.error("Error:", status, error);
		}
	})
	//全部订单
	$(".allBill,.list-order").click(function () {
		$.ajax({
			url: "http://localhost:8080/hotel/findHotelByUserId",
			type: "GET",
			headers: {
				"token": sessionStorage.getItem('token')
			},
			success: function (rs) {
				if (rs.code === 2001) {
					var orders = rs.t;
					$(".order-top").nextAll().remove();
					if (orders.length > 0) {
						creatOrderThead();
						orders.forEach(function (order) {
							creatOrder(order);
						});
					} else {
						creatNoOrder();
					}
				} else {
					alert(rs.message);
				}
			},
			error: function (xhr, status, error) {
				alert("请求失败！");
				console.error("Error:", status, error);
			}
		})
	});
	//待支付
	$(".waitPay").click(function () {
		$.ajax({
			url: "http://localhost:8080/hotel/findHotelByIdUnpaid",
			type: "GET",
			headers: {
				"token": sessionStorage.getItem('token')
			},
			success: function (rs) {
				if (rs.code === 2001) {
					var orders = rs.t;
					$(".order-top").nextAll().remove();
					if (orders.length > 0) {
						creatOrderThead();
						orders.forEach(function (order) {
							creatOrder(order);
						});
					} else {
						creatNoOrder();
					}
				} else {
					alert(rs.message);
				}
			},
			error: function (xhr, status, error) {
				alert("请求失败！");
				console.error("Error:", status, error);
			}
		})
	});
	//待出行
	$(".waitGo").click(function () {
		$.ajax({
			url: "http://localhost:8080/hotel/findHotelByIdTravel",
			type: "GET",
			headers: {
				"token": sessionStorage.getItem('token')
			},
			success: function (rs) {
				if (rs.code === 2001) {
					var orders = rs.t;
					$(".order-top").nextAll().remove();
					if (orders.length > 0) {
						creatOrderThead();
						orders.forEach(function (order) {
							creatOrder(order);
						});
					} else {
						creatNoOrder();
					}
				} else {
					alert(rs.message);
				}
			},
			error: function (xhr, status, error) {
				alert("请求失败！");
				console.error("Error:", status, error);
			}
		})
	});
	//待评价
	$(".waitComment").click(function () {
		$.ajax({
			url: "http://localhost:8080/hotel/findHotelByIdAssess",
			type: "GET",
			headers: {
				"token": sessionStorage.getItem('token')
			},
			success: function (rs) {
				if (rs.code === 2001) {
					var orders = rs.t;
					$(".order-top").nextAll().remove();
					if (orders.length > 0) {
						creatOrderThead();
						orders.forEach(function (order) {
							creatOrder(order);
						});
					} else {
						creatNoOrder();
					}
				} else {
					alert(rs.message);
				}
			},
			error: function (xhr, status, error) {
				alert("请求失败！");
				console.error("Error:", status, error);
			}
		})
	});
	//创建订单表头函数
	function creatOrderThead() {
		var div_thead = $("<div class='row order-thead'></div>");
		var div_message = $("<div class='col-lg-3'>产品信息</div>");
		var div_price = $("<div class='col-lg-2'>订单金额</div>");
		var div_number = $("<div class='col-lg-3'>订单编号</div>");
		var div_status = $("<div class='col-lg-1'>订单状态</div>");
		var div_option = $("<div class='col-lg-2'>订单操作</div>");

		var div_tbody = $("<div class='row order-tbody'></div>");
		var div_tag = $("<div class='col-lg-12'></div>");
		var ul_tag = $("<ul class='order-list'></ul>");
		div_thead.addClass("order-thead");

		div_thead.append(div_message);
		div_thead.append(div_price);
		div_thead.append(div_number);
		div_thead.append(div_status);
		div_thead.append(div_option);
		div_tag.append(ul_tag);
		div_tbody.append(div_tag);

		$(".myorder").append(div_thead).append(div_tbody);
		$(".myhaven").append(div_thead).append(div_tbody);
	}

	//创建订单内容函数
	function creatOrder(data) {
		console.log(data);

		var li_tag = $('<li>');

		// 创建产品信息部分
		var productInfo = $('<div>').addClass('col-lg-3');
		var productRow = $('<div>').addClass('row');

		// 产品图片
		var photoCol = $('<div>').addClass('col-lg-4 order-photo');
		var photoImg = $('<img>').attr({
			src: './static/image/me/lvyou.jpg',
			alt: '...'
		});
		photoCol.append(photoImg);

		// 产品信息
		var messageCol = $('<div>').addClass('col-lg-8 order-message');
		var goodsTypeRow = $('<div>').addClass('row goods-type');
		var goodsTypeCol = $('<div>').addClass('col-lg-12');
		goodsTypeCol.append($('<span>').html(data.hotel_name));
		goodsTypeRow.append(goodsTypeCol);

		var payTypeRow = $('<div>').addClass('row pay-type');
		var payTypeCol = $('<div>').addClass('col-lg-12');
		payTypeCol.append($('<span>').html('支付宝订单'));
		payTypeRow.append(payTypeCol);

		var orderTimeRow = $('<div>').addClass('row order-time');
		var orderTimeCol = $('<div>').addClass('col-lg-12');
		orderTimeCol.append($('<span>').html('出行时间：'));
		orderTimeCol.append($('<span>').html(data.check_time));
		orderTimeRow.append(orderTimeCol);

		messageCol.append(goodsTypeRow).append(payTypeRow).append(orderTimeRow);
		productRow.append(photoCol).append(messageCol);
		productInfo.append(productRow);

		// 订单金额
		var orderPrice = $('<div>').addClass('col-lg-2 order-price');
		orderPrice.append($('<span>').text('￥')).append($('<span>').html(data.book_price));

		// 订单编号
		var orderNo = $('<div>').addClass('col-lg-3 orderno');
		orderNo.append($('<span>').html('YNC1I2PRQ5EG9NDO0E03853G'));

		// 订单状态
		var orderState = $('<div>').addClass('col-lg-1 order-state');
		orderState.append($('<span>').html(data.pay_status));

		// 订单操作
		var orderOption = $('<div>').addClass('col-lg-2 order-option');
		if (data.pay_status === '待支付') {
			var payButtom = $('<button>').addClass('btn btn-primary order-buttom').text('去支付');
			payButtom.click(function () {
				window.location.href = "#";
			});
			orderOption.append(payButtom);
		} else if (data.pay_status === '待评价') {
			var commentButtom = $('<button>').addClass('btn btn-primary order-buttom').text('去评价');
			commentButtom.click(function () {
				window.location.href = "/reviews.html?orderId=" + data.id + "&&hotel_name=" + data.hotel_name;
			});
			orderOption.append(commentButtom);
		} else {
			orderOption.append($('<span>').html(data.pay_status));
		}

		// 将所有部分添加到主容器中
		var row = $('<div>').addClass('row');
		row.append(productInfo).append(orderPrice).append(orderNo)
			.append(orderState).append(orderOption);
		li_tag.append(row);
		$('.order-list').append(li_tag);
	}

	//生成无订单页面
	function creatNoOrder() {
		// 创建最外层的row
		var maxRow = $('<div></div>').addClass('row noorder justify-content-center align-items-center');
		var maxDiv = $('<div></div>').addClass('col-lg-6')

		// 创建第一个row
		var firstRow = $('<div></div>').addClass('row justify-content-center align-items-center');
		var firstCol = $('<div></div>').addClass('col-lg-2');
		var img = $('<img>').attr({
			src: './static/image/me/nodingdan.png',
			alt: '...'
		});
		firstCol.append(img);
		firstRow.append(firstCol);

		// 创建第二个row
		var secondRow = $('<div></div>').addClass('row justify-content-center align-items-center');
		var secondCol = $('<div></div>').addClass('col-lg-8');
		var span = $('<span></span>').text('您的订单空空如也，快');
		var link = $('<a></a>').attr('href', '#').text('去看看');
		var textAfterLink = $('<span></span>').text('想去哪里玩吧');
		secondCol.append(span).append(' ').append(link).append(' ').append(textAfterLink);
		secondRow.append(secondCol);

		maxDiv.append(firstRow).append(secondRow);
		maxRow.append(maxDiv);
		$(".myorder").append(maxRow);
	}
})

//添加登录
window.onload = function () {
	var nickname = sessionStorage.getItem("nickname");

	if (nickname) {
		// 如果有昵称，替换登录注册的链接
		document.querySelector('.user-account').innerHTML = `
            <span>Hello! ${nickname}</span>/
            <a href="#" id="logout">退出登录</a>
        `;

		// 添加点击事件来处理退出登录
		document.getElementById('logout').addEventListener('click', function (event) {
			event.preventDefault(); // 阻止默认的链接跳转
			sessionStorage.removeItem("nickname"); // 清除昵称
			window.location.href = "login.html"; // 跳转到登录页面
		});
	}
};